<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="UTF-8" />
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>首页</title>
    <link rel="stylesheet" href="css/yueke.css">
    <script type="text/javascript" src="js/jquery.min.js"></script>
</head>
<body>
    <div class="header">
        <div class="header_in">
            <div class="header_logo">
                <h1></h1>
                <img src="images/index_log.jpg" />
            </div>
            <div class="header_nav">
                <ul>
                    <li><a href="model_news_list.html">前沿资讯</a></li>
                    <li><a href="model_problem_list.html">互动问答</a></li>
                    <li><a href="model_personage_center.html">帮助中心</a></li>
                </ul>
            </div>
            <div class="header_info">
                <div class="header_info_find"><a href="#">寻找合作伙伴</a></div>
                <div class="header_register">
                    <a href="#">登录</a>|
                    <a href="#">注册</a>
                </div>
                <div class="header_become">
                    <a href="#">成为我们的专家</a>
                </div>
            </div>
            <div class="clear_both"></div>
        </div>
    </div>
    <div class="index_banner">
        <ul class="index_banner_in" id="index_banner">
            <li class="index_banner_item">
                <div class="index_banner_item_in">
                    <img src="images/index_banner.jpg" alt="" />
                </div>
            </li>
        </ul>
        <ol class="index_banner_circle" id="index_circle">
            <li class="active"></li>
        </ol>
        <div class="index_banner_prev" id="index_prev"></div>
        <div class="index_banner_next" id="index_next"></div>
    </div>
    <div class="index_teamwork">
        <h3 class="index_title index_teamwork_title">寻找最专业的合作伙伴</h3>
        <ul class="index_teamwork_list">
            <li class="index_teamwork_item">
                <div class="index_teamwork_item_show">
                    <div class="index_teamwork_item_img">
                        <img src="images/index_teamwork_item_img1.jpg" alt="" />
                    </div>
                    <p class="index_teamwork_item_des">人工智能</p>
                </div>
                <div class="index_teamwork_item_detail">
                    <p>航天技术与其他科学技术相结合</p>
                    <p>开创了许多新的技术途径，</p>
                    <p>产生巨大的经济和社会效益。</p>
                </div>
            </li>
            <li class="index_teamwork_item">
                <div class="index_teamwork_item_show">
                    <div class="index_teamwork_item_img">
                        <img src="images/index_teamwork_item_img2.jpg" alt="" />
                    </div>
                    <p class="index_teamwork_item_des">新能源</p>
                </div>
                <div class="index_teamwork_item_detail">
                    <p>航天技术与其他科学技术相结合</p>
                    <p>开创了许多新的技术途径，</p>
                    <p>产生巨大的经济和社会效益。</p>
                </div>
            </li>
            <li class="index_teamwork_item">
                <div class="index_teamwork_item_show">
                    <div class="index_teamwork_item_img">
                        <img src="images/index_teamwork_item_img3.jpg" alt="" />
                    </div>
                    <p class="index_teamwork_item_des">新材料</p>
                </div>
                <div class="index_teamwork_item_detail">
                    <p>航天技术与其他科学技术相结合</p>
                    <p>开创了许多新的技术途径，</p>
                    <p>产生巨大的经济和社会效益。</p>
                </div>
            </li>
            <li class="index_teamwork_item">
                <div class="index_teamwork_item_show">
                    <div class="index_teamwork_item_img">
                        <img src="images/index_teamwork_item_img4.jpg" alt="" />
                    </div>
                    <p class="index_teamwork_item_des">医疗与健康</p>
                </div>
                <div class="index_teamwork_item_detail">
                    <p>航天技术与其他科学技术相结合</p>
                    <p>开创了许多新的技术途径，</p>
                    <p>产生巨大的经济和社会效益。</p>
                </div>
            </li>
            <li class="index_teamwork_item">
                <div class="index_teamwork_item_show">
                    <div class="index_teamwork_item_img">
                        <img src="images/index_teamwork_item_img5.jpg" alt="" />
                    </div>
                    <p class="index_teamwork_item_des">检验与检测</p>
                </div>
                <div class="index_teamwork_item_detail">
                    <p>航天技术与其他科学技术相结合</p>
                    <p>开创了许多新的技术途径，</p>
                    <p>产生巨大的经济和社会效益。</p>
                </div>
            </li>
            <li class="index_teamwork_item">
                <div class="index_teamwork_item_show">
                    <div class="index_teamwork_item_img">
                        <img src="images/index_teamwork_item_img7.jpg" alt="" />
                    </div>
                    <p class="index_teamwork_item_des">检验与检测</p>
                </div>
                <div class="index_teamwork_item_detail">
                    <p>航天技术与其他科学技术相结合</p>
                    <p>开创了许多新的技术途径，</p>
                    <p>产生巨大的经济和社会效益。</p>
                </div>
            </li>
            <li class="index_teamwork_item">
                <div class="index_teamwork_item_show">
                    <div class="index_teamwork_item_img">
                        <img src="images/index_teamwork_item_img6.jpg" alt="" />
                    </div>
                    <p class="index_teamwork_item_des">信息科技</p>
                </div>
                <div class="index_teamwork_item_detail">
                    <p>航天技术与其他科学技术相结合</p>
                    <p>开创了许多新的技术途径，</p>
                    <p>产生巨大的经济和社会效益。</p>
                </div>
            </li>
            <li class="index_teamwork_item">
                <div class="index_teamwork_item_show">
                    <div class="index_teamwork_item_img">
                        <img src="images/index_teamwork_item_img7.jpg" alt="" />
                    </div>
                    <p class="index_teamwork_item_des">食品与安全</p>
                </div>
                <div class="index_teamwork_item_detail">
                    <p>航天技术与其他科学技术相结合</p>
                    <p>开创了许多新的技术途径，</p>
                    <p>产生巨大的经济和社会效益。</p>
                </div>
            </li>
        </ul>
        <div class="index_teamwork_check">
            <a href="#">查看更多分类</a>
        </div>
    </div>
    <div class="index_wait">
        <h3 class="index_title index_wait_title">寻找最专业的合作伙伴</h3>
        <div class="index_wait_list_outer">
            <ul class="index_wait_list" id="index_carousel">
                <li class="index_wait_item">
                    <div class="index_wait_item_title">
                        征集快速检测金属含量的技术
                    </div>
                    <p class="index_wait_item_info">
                        能快速检测出材料中的锂含量比例是多少，要求在生产中方便可行，包括相关专利也要一并转让给我们。
                    </p>
                    <div class="index_wait_item_price">
                        <span class="index_wait_item_price_icon">￥</span>
                        <span class="index_wait_item_price_num">2000-5000</span>
                    </div>
                </li>
                <li class="index_wait_item">
                    <div class="index_wait_item_title">
                        征集快速检测金属含量的技术
                    </div>
                    <p class="index_wait_item_info">
                        能快速检测出材料中的锂含量比例是多少，要求在生产中方便可行，包括相关专利也要一并转让给我们。
                    </p>
                    <div class="index_wait_item_price">
                        <span class="index_wait_item_price_icon">￥</span>
                        <span class="index_wait_item_price_num">2000-5000</span>
                    </div>
                </li>
                <li class="index_wait_item">
                    <div class="index_wait_item_title">
                        征集快速检测金属含量的技术
                    </div>
                    <p class="index_wait_item_info">
                        能快速检测出材料中的锂含量比例是多少，要求在生产中方便可行，包括相关专利也要一并转让给我们。
                    </p>
                    <div class="index_wait_item_price">
                        <span class="index_wait_item_price_icon">￥</span>
                        <span class="index_wait_item_price_num">2000-5000</span>
                    </div>
                </li>
                <li class="index_wait_item">
                    <div class="index_wait_item_title">
                        征集快速检测金属含量的技术
                    </div>
                    <p class="index_wait_item_info">
                        能快速检测出材料中的锂含量比例是多少，要求在生产中方便可行，包括相关专利也要一并转让给我们。
                    </p>
                    <div class="index_wait_item_price">
                        <span class="index_wait_item_price_icon">￥</span>
                        <span class="index_wait_item_price_num">2000-5000</span>
                    </div>
                </li>
                <li class="index_wait_item">
                    <div class="index_wait_item_title">
                        征集快速检测金属含量的技术
                    </div>
                    <p class="index_wait_item_info">
                        能快速检测出材料中的锂含量比例是多少，要求在生产中方便可行，包括相关专利也要一并转让给我们。
                    </p>
                    <div class="index_wait_item_price">
                        <span class="index_wait_item_price_icon">￥</span>
                        <span class="index_wait_item_price_num">2000-5000</span>
                    </div>
                </li>
                <li class="index_wait_item">
                    <div class="index_wait_item_title">
                        征集快速检测金属含量的技术
                    </div>
                    <p class="index_wait_item_info">
                        能快速检测出材料中的锂含量比例是多少，要求在生产中方便可行，包括相关专利也要一并转让给我们。
                    </p>
                    <div class="index_wait_item_price">
                        <span class="index_wait_item_price_icon">￥</span>
                        <span class="index_wait_item_price_num">2000-5000</span>
                    </div>
                </li>
                <li class="index_wait_item">
                    <div class="index_wait_item_title">
                        征集快速检测金属含量的技术
                    </div>
                    <p class="index_wait_item_info">
                        能快速检测出材料中的锂含量比例是多少，要求在生产中方便可行，包括相关专利也要一并转让给我们。
                    </p>
                    <div class="index_wait_item_price">
                        <span class="index_wait_item_price_icon">￥</span>
                        <span class="index_wait_item_price_num">2000-5000</span>
                    </div>
                </li>
            </ul>
        </div>
        <ol class="index_wait_arrows">
            <li class="index_wait_arrows_prev" id="btn_prev"></li>
            <li class="index_wait_arrows_next" id="btn_next"></li>
        </ol>
        <div class="index_teamwork_check index_wait_check">
            <a href="#">查看更多项目</a>
        </div>
    </div>
    <div class="index_gift">
        <div class="index_gift_left">
            <h4>这里有你想不到的天赋</h4>
            <p>IEEE最年轻科学家</p>
            <p>60多项美国专利，500多篇学术论文和11本专著</p>
            <p>曾担任微软亚洲研究院院长兼首席科学家</p>
            <p>担任多个省市的政府顾问和20所大学的校董或名誉教授</p>
        </div>
        <div class="index_gift_right">
            <img src="images/index_gift_right.jpg" alt="" />
        </div>
    </div>
    <div class="index_banner_small">
        <div class="index_banner_small_in">
            <img src="images/index_banner_small1.png" alt="" />
        </div>
    </div>
    <div class="index_communication">
        <div class="index_communication_left">
            <img src="images/index_communication_left.jpg" alt="" />
        </div>
        <div class="index_communication_right">
            <h4>成功从有效而快速的沟通开始</h4>
            <p>指在学术、技艺等方面有专门研究或特长的人。</p>
            <p>南朝梁沉约 《到著作省表》：“臣艺不博古，学谢专家。” </p>
            <p>清薛福成《应诏陈言疏》：“ 中国 则不然，凡百工技艺，视为鄙事，</p>
            <p>聪明之士不肯留意於其间，此所以少专家也。”</p>
        </div>
    </div>
    <div class="index_banner_small">
        <div class="index_banner_small_in">
            <img src="images/index_banner_small2.jpg" alt="" />
        </div>
    </div>
    <div class="index_team">
        <div class="index_team_left">
            <h4>这里有你想不到的天赋</h4>
            <p>IEEE最年轻科学家</p>
            <p>60多项美国专利，500多篇学术论文和11本专著</p>
            <p>曾担任微软亚洲研究院院长兼首席科学家</p>
            <p>担任多个省市的政府顾问和20所大学的校董或名誉教授</p>
        </div>
        <div class="index_team_right">
            <img src="images/index_team_right.jpg" alt="" />
        </div>
    </div>
    <div class="index_banner_small">
        <div class="index_banner_small_in">
            <img src="images/index_banner_small3.jpg" alt="" />
        </div>
    </div>
    <div class="index_group">
        <h3 class="index_title index_group_title">寻找最专业的合作伙伴</h3>
        <div class="index_group_btn"><a href="#">开始寻找合作伙伴</a></div>
    </div>
    <div class="index_link">
        <div class="index_link_in"></div>
    </div>
    <div class="index_footer">
        <div class="index_footer_link">
            <a href="">新闻公告</a>|
            <a href="">关于我们</a>|
            <a href="">联系我们</a>|
            <a href="">用户协议</a>
        </div>
        <p class="index_footer_copy">Copyright©2016 yk-zb.com 粤科众包 版权所有 粤ICP备16027165号-1</p>
    </div>
</body>
</html>
<script type="text/javascript">
    $(function() {
        //轮播
        (function fnCarousel(){
            var iWidth = $("#index_carousel li").width()+30;
            var inum = $("#index_carousel li").length;
            var indexOld = 0;
            $('#index_carousel').css('width' , iWidth * inum + 'px');
            console.log($('#index_carousel').width())
            $('#btn_next').click(function(event) {
                if(inum - indexOld <= 3){
                    return;
                }
                indexOld++;
                console.log(indexOld);
                $('#index_carousel').animate({"left":-iWidth * indexOld + "px"}, 200);
            });
            $('#btn_prev').click(function(event) {
                if(indexOld == 0){
                    return;
                }
                indexOld--;
                console.log(indexOld);
                $('#index_carousel').animate({"left":-iWidth * indexOld + "px"}, 200);
            });
        })();

        //banner 轮播
        (function fnBanner(){
            var iWinWidth = $(window).width();
            var iNum = $('#index_banner li').length;
            var iCirWidth = $('#index_circle li').width()*iNum + 22*(iNum - 1);
            var indexOld = 0;
            $('#index_banner li').css('width',iWinWidth+'px');
            $('#index_circle').css({"width":iCirWidth + "px","margin-left":-iCirWidth/2 + "px"});
            $('#index_banner').css({"width":iWinWidth * iNum + "px"});
            if(iNum <= 1){
                $('#index_circle').hide();
                $('#index_next').hide();
                $('#index_prev').hide();
            }
            $('#index_next').click(function(event) {
                if(indexOld >= 2){
                    return;
                }
                indexOld++;
                console.log(indexOld);
                $('#index_circle li').removeClass('active');
                $('#index_circle li').eq(indexOld).addClass('active');
                $('#index_banner').animate({"left":-iWinWidth * indexOld + "px"}, 200);
            });
            $('#index_prev').click(function(event) {
                if(indexOld == 0){
                    return;
                }
                indexOld--;
                console.log(indexOld);
                $('#index_circle li').removeClass('active');
                $('#index_circle li').eq(indexOld).addClass('active');
                $('#index_banner').animate({"left":-iWinWidth * indexOld + "px"}, 200);
            });
            $('#index_circle li').click(function(event) {
                indexOld = $('#index_circle li').index(this);
                $('#index_circle li').removeClass('active');
                $('#index_circle li').eq(indexOld).addClass('active');
                $('#index_banner').animate({"left":-iWinWidth * indexOld + "px"}, 200);
            });
        })();
        (function fnShow(){
            $('.index_teamwork_item').hover(function() {
                $('.index_teamwork_item').removeClass('active');
                $(this).addClass('active');
            }, function() {
                $('.index_teamwork_item').removeClass('active');
            });
        })();
    });
</script>